<template>
  <div class="app-container">

    <!-- 过滤器 -->
    <div class="filter-container">
      <span>姓名: </span>
      <el-input
        v-model="listQuery.name"
        placeholder="请输入姓名"
        style="width: 200px;"
        class="filter-item"
      />
      <!-- 空隙 -->
      <div style="width: 20px; display: inline-block;" />
      <span>住院号: </span>
      <el-input
        v-model="listQuery.admission_no"
        placeholder="请输入住院号"
        style="width: 200px;"
        class="filter-item"
      />
      <!-- 空隙 -->
      <div style="width: 20px; display: inline-block;" />
      <el-button v-waves class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">
        搜索
      </el-button>
      <el-button v-waves class="filter-item" type="primary" icon="el-icon-download" @click="exportExcel">
        导出
      </el-button>
      <!-- 新增按钮 -->
      <el-button v-waves class="filter-item" type="primary" icon="el-icon-plus" @click="openAddDialog">
        新增
      </el-button>
    </div>

    <!-- 表格 -->
    <el-table v-loading="listLoading" :data="userinfo" border fit highlight-current-row style="width: 100%">
      <!-- ID -->
      <!-- <el-table-column align="center" label="ID" width="50">
        <template slot-scope="scope">
          <span>{{ scope.row.id }}</span>
        </template>
      </el-table-column> -->
      <!-- 综合信息 -->
      <el-table-column align="center" label="综合信息" width="450">
        <template slot-scope="scope">
          <div style="display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(5, auto); gap: 10px;">
            <!-- Row 1 -->
            <div style="border-right: 1px solid #ccc;"><strong>姓名:</strong> {{ scope.row.name }}</div>
            <div style="border-right: 1px solid #ccc;"><strong>住院号:</strong> {{ scope.row.admission_no }}</div>
            <div><strong>诊断:</strong> {{ scope.row.diagnosis }}</div>

            <!-- Row 2 -->
            <div style="border-right: 1px solid #ccc;"><strong>合并疾病:</strong> {{ scope.row.comorbidity }}</div>
            <div style="border-right: 1px solid #ccc;"><strong>年龄:</strong> {{ scope.row.age }}</div>
            <div><strong>治疗方式:</strong> {{ scope.row.therapeutic_modality }}</div>

            <!-- Row 3 -->
            <div style="border-right: 1px solid #ccc;"><strong>性别:</strong> {{ scope.row.gender }}</div>
            <div style="border-right: 1px solid #ccc;"><strong>生育史:</strong> {{ scope.row.fertility_history }}</div>
            <div><strong>婚姻状况:</strong> {{ scope.row.marital_status }}</div>

            <!-- Row 4 -->
            <div style="border-right: 1px solid #ccc;"><strong>教育程度:</strong> {{ scope.row.education_level }}</div>
            <div style="border-right: 1px solid #ccc;"><strong>职业:</strong> {{ scope.row.occupation }}</div>
            <div><strong>医疗费用承担方式:</strong> {{ scope.row.methods_of_medical_cost_coverage }}</div>

            <!-- Row 5 -->
            <div style="border-right: 1px solid #ccc;"><strong>居住地:</strong> {{ scope.row.address }}</div>
            <div style="border-right: 1px solid #ccc;"><strong>电话:</strong> {{ scope.row.phone }}</div>
            <div><strong>备注:</strong> {{ scope.row.notes }}</div>
          </div>
        </template>
      </el-table-column>

      <!-- 三次对比 -->
      <el-table-column align="center" label="体征对比" width="621">
        <template slot-scope="scope">
          <el-table :data="[scope.row]" style="width: 100%; margin-bottom: 20px;">
            <el-table-column label="入院时间" width="120">
              <template slot-scope="scope">
                <span v-if="formatDate(scope.row.inhospital_time)=='1970-01-01'">未填写</span>
                <span v-else>{{ formatDate(scope.row.inhospital_time) }}</span>
              </template>
            </el-table-column>
            <el-table-column property="temperature" label="入院时体温" width="120" />
            <el-table-column property="pulse" label="入院时脉搏" width="120" />
            <el-table-column property="respiration_rate" label="入院时呼吸" width="120" />
            <el-table-column property="blood_pressure" label="入院时血压" width="120" />
          </el-table>
          <el-table :data="[scope.row]" style="width: 100%; margin-bottom: 20px;">
            <el-table-column label="出院时间" width="120">
              <template slot-scope="scope">
                <span v-if="formatDate(scope.row.outhospital_time)=='1970-01-01'">未填写</span>
                <span v-else>{{ formatDate(scope.row.outhospital_time) }}</span>

              </template>
            </el-table-column>
            <el-table-column property="temperature_out" label="出院时体温" width="120" />
            <el-table-column property="pulse_out" label="出院时脉搏" width="120" />
            <el-table-column property="respiration_rate_out" label="出院时呼吸" width="120" />
            <el-table-column property="blood_pressure_out" label="出院时血压" width="120" />
          </el-table>
          <el-table :data="[scope.row]" style="width: 100%">
            <el-table-column label="两个月时间" width="120">出院后两个月</el-table-column>
            <el-table-column property="temperature_2_months" label="2个月时体温" width="120" />
            <el-table-column property="pulse_2_months" label="2个月时脉搏" width="120" />
            <el-table-column property="respiration_rate_2_months" label="2个月时呼吸" width="120" />
            <el-table-column property="blood_pressure_2_months" label="2个月时血压" width="120" />
          </el-table>
        </template>
      </el-table-column>

      <!-- 创建时间 -->
      <!-- <el-table-column align="center" label="创建时间" width="120">
        <template slot-scope="scope">
          <span>{{ formatDate(scope.row.create_time) }}</span>
        </template>
      </el-table-column> -->
      <!-- 更新时间 -->
      <!-- <el-table-column align="center" label="更新时间" width="120">
        <template slot-scope="scope">
          <span>{{ formatDate(scope.row.update_time) }}</span>
        </template>
      </el-table-column> -->
      <!-- user/doctor -->
      <!-- <el-table-column align="center" label="user/doctor" width="100">
        <template slot-scope="scope">
          <span>{{ scope.row.roles }}</span>
        </template>
      </el-table-column> -->
      <!-- 删除操作列 -->
      <el-table-column align="center" label="操作" width="400" fixed="right">
        <template slot-scope="scope">
          <!-- 月训练情况按钮 -->
          <el-button v-waves class="filter-item" type="primary" @click="handleClickmonthtraininglist(scope.row.id)">
            月训练情况
          </el-button>
          <!-- 训练情况按钮 -->
          <el-button v-waves class="filter-item" type="primary" @click="handleClicktraininglist(scope.row.id)">
            详细训练情况
          </el-button>
          <br/> <br/> <br/>
          <!-- 心理三次对比按钮 -->
          <el-button v-waves class="filter-item" type="primary" @click="handleClick(scope.row.id,scope.row.name)">
            心理量表查看
          </el-button>
          <!-- 编辑按钮 -->
          <el-button v-waves type="primary" @click="openEditDialog(scope.row)">
            编辑信息
          </el-button>
          <br/> <br/> <br/>
          <el-button v-waves type="danger" @click="handleDelete(scope.row.id)">
            删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <!-- 分页 -->
    <pagination v-show="total > 0" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit" @pagination="getList" />

    <!-- 新增对话框 -->
    <el-dialog title="新增患者" :visible.sync="addDialogVisible">
      <el-form :model="addForm" label-width="120px">
        <el-form-item label="姓名">
          <el-input v-model="addForm.name" />
        </el-form-item>
        <el-form-item label="住院号">
          <el-input v-model="addForm.admission_no" />
        </el-form-item>
        <!-- <el-form-item label="身份证号码">
          <el-input v-model="addForm.identity_card" />
        </el-form-item> -->
        <el-form-item label="诊断">
          <el-input v-model="addForm.diagnosis" />
        </el-form-item>
        <el-form-item label="合并疾病">
          <!-- <el-input v-model="addForm.comorbidity" /> -->
               <el-select v-model="addForm.comorbidity" placeholder="请选择合并疾病">
                        <el-option label="高血压" value="高血压" />
                        <el-option label="糖尿病" value="糖尿病" />
                        <el-option label="冠心病" value="冠心病" />
                        <el-option label="高血脂" value="高血脂" />
                        <el-option label="其他" value="其他" />
                    </el-select>
        </el-form-item>
        <el-form-item label="年龄">
          <el-input v-model="addForm.age" />
        </el-form-item>
        <el-form-item label="治疗方式">
          <!-- <el-input v-model="addForm.therapeutic_modality" /> -->
                    <el-select v-model="addForm.therapeutic_modality" placeholder="请选择治疗方式">
                        <el-option label="手术" value="手术" />
                        <el-option label="化疗" value="化疗" />
                        <el-option label="放疗" value="放疗" />
                        <el-option label="介入治疗" value="介入治疗" />
                        <el-option label="分子靶向" value="分子靶向" />
                        <el-option label="免疫治疗" value="免疫治疗" />
                        <el-option label="中医中药" value="中医中药" />
                    </el-select>
        </el-form-item>
        <el-form-item label="性别">
          <!-- <el-input v-model="addForm.gender" /> -->
            <el-select v-model="addForm.gender" placeholder="请选择性别">
                        <el-option label="男" value="男" />
                        <el-option label="女" value="女" />
                    </el-select>
        </el-form-item>
        <el-form-item label="生育史">
          <el-input v-model="addForm.fertility_history" />
        </el-form-item>
        <el-form-item label="入院日期">
          <el-date-picker
            v-model="addForm.inhospital_time"
            type="datetime"
            placeholder="请选择入院日期和时间"
            format="yyyy-MM-dd HH:mm:ss"
            value-format="yyyy-MM-dd HH:mm:ss"
            style="width: 100%;"
          />
        </el-form-item>
        <el-form-item label="入院时体温">
          <el-input v-model="addForm.temperature" />
        </el-form-item>
        <el-form-item label="入院时脉搏">
          <el-input v-model="addForm.pulse" />
        </el-form-item>
        <el-form-item label="入院时呼吸">
          <el-input v-model="addForm.respiration_rate" />
        </el-form-item>
        <el-form-item label="入院时血压">
          <el-input v-model="addForm.blood_pressure" />
        </el-form-item>
        <el-form-item label="出院日期">
          <el-date-picker
            v-model="addForm.outhospital_time"
            type="datetime"
            placeholder="请选择出院日期和时间"
            format="yyyy-MM-dd HH:mm:ss"
            value-format="yyyy-MM-dd HH:mm:ss"
            style="width: 100%;"
          />
        </el-form-item>
        <el-form-item label="出院时体温">
          <el-input v-model="addForm.temperature_out" />
        </el-form-item>
        <el-form-item label="出院时脉搏">
          <el-input v-model="addForm.pulse_out" />
        </el-form-item>
        <el-form-item label="出院时呼吸">
          <el-input v-model="addForm.respiration_rate_out" />
        </el-form-item>
        <el-form-item label="出院时血压">
          <el-input v-model="addForm.blood_pressure_out" />
        </el-form-item>
        <el-form-item label="2个月时体温">
          <el-input v-model="addForm.temperature_2_months" />
        </el-form-item>
        <el-form-item label="2个月时脉搏">
          <el-input v-model="addForm.pulse_2_months" />
        </el-form-item>
        <el-form-item label="2个月时呼吸">
          <el-input v-model="addForm.respiration_rate_2_months" />
        </el-form-item>
        <el-form-item label="2个月时血压">
          <el-input v-model="addForm.blood_pressure_2_months" />
        </el-form-item>
        <el-form-item label="婚姻状况">
          <!-- <el-input v-model="addForm.marital_status" /> -->
                    <el-select v-model="addForm.marital_status" placeholder="请选择婚姻状况">
                        <el-option label="未婚" value="未婚" />
                        <el-option label="已婚" value="已婚" />
                        <el-option label="丧偶" value="丧偶" />
                        <el-option label="离婚" value="离婚" />
                        <el-option label="未说明的婚姻状况" value="未说明的婚姻状况" />
                    </el-select>
        </el-form-item>
        <el-form-item label="受教育程度">
          <!-- <el-input v-model="addForm.education_level" /> -->
                    <el-select v-model="addForm.education_level" placeholder="请选择受教育程度">
                        <el-option label="文盲及半文盲" value="文盲及半文盲" />
                        <el-option label="小学" value="小学" />
                        <el-option label="初中" value="初中" />
                        <el-option label="高中/技校/中专" value="高中/技校/中专" />
                        <el-option label="大专" value="大专" />
                        <el-option label="本科" value="本科" />
                        <el-option label="硕士及以上" value="硕士及以上" />
                    </el-select>
        </el-form-item>
        <el-form-item label="职业">
          <!-- <el-input v-model="addForm.occupation" /> -->
                <el-select v-model="addForm.occupation" placeholder="请选择职业">
                        <el-option label="公务员" value="公务员" />
                        <el-option label="企事业单位人员" value="企事业单位人员" />
                        <el-option label="教师" value="教师" />
                        <el-option label="医务人员" value="医务人员" />
                        <el-option label="科研人员" value="科研人员" />
                        <el-option label="其他专业技术人员" value="其他专业技术人员" />
                        <el-option label="商业、服务业人员" value="商业、服务业人员" />
                        <el-option label="农民" value="农民" />
                        <el-option label="工人" value="工人" />
                        <el-option label="军人" value="军人" />
                        <el-option label="其他" value="其他" />
                    </el-select>
        </el-form-item>
        <el-form-item label="医疗费用承担方式">
          <!-- <el-input v-model="addForm.methods_of_medical_cost_coverage" /> -->
                    <el-select v-model="addForm.methods_of_medical_cost_coverage" placeholder="请选择医疗费用承担方式">
                        <el-option label="城镇职工基本医疗保险" value="城镇职工基本医疗保险" />
                        <el-option label="城镇居民基本医疗保险" value="城镇居民基本医疗保险" />
                        <el-option label="受新型农村合作医疗" value="受新型农村合作医疗" />
                        <el-option label="贫困救助" value="贫困救助" />
                        <el-option label="商业医疗保险" value="商业医疗保险" />
                        <el-option label="全公费" value="全公费" />
                        <el-option label="全自费" value="全自费" />
                        <el-option label="其他" value="其他" />
                    </el-select>
        </el-form-item>
        <el-form-item label="居住地">
          <el-input v-model="addForm.address" />
        </el-form-item>
        <el-form-item label="电话">
          <el-input v-model="addForm.phone" />
        </el-form-item>
        <el-form-item label="备注">
          <el-input v-model="addForm.notes" />
        </el-form-item>
        <el-form-item label="角色">
          <el-select v-model="addFormdefault.roles" placeholder="请选择角色" style="width: 100%;">
            <el-option label="User" value="user" />
            <el-option label="Doctor" value="doctor" />
          </el-select>
        </el-form-item>
        <el-form-item label="group_class">
          <el-input v-model="addFormdefault.group_class" :disabled="true" />
        </el-form-item>
      </el-form>
      <!-- 对话框底部的按钮 -->
      <div slot="footer" class="dialog-footer">
        <el-button @click="addDialogVisible = false">取消</el-button>
        <el-button type="primary" @click="handleAdd">保存</el-button>
      </div>
    </el-dialog>

    <!-- 编辑对话框 -->
    <el-dialog title="编辑患者" :visible.sync="editDialogVisible">
      <el-form :model="editForm" label-width="120px">
        <el-form-item label="姓名">
          <el-input v-model="editForm.name" />
        </el-form-item>
        <el-form-item label="住院号">
          <el-input v-model="editForm.admission_no" />
        </el-form-item>
        <!-- <el-form-item label="身份证号码">
          <el-input v-model="editForm.identity_card" />
        </el-form-item> -->
        <el-form-item label="诊断">
          <el-input v-model="editForm.diagnosis" />
        </el-form-item>
        <el-form-item label="合并疾病">
          <!-- <el-input v-model="editForm.comorbidity" /> -->
          <el-select v-model="editForm.comorbidity" placeholder="请选择合并疾病">
            <el-option label="高血压" value="高血压" />
            <el-option label="糖尿病" value="糖尿病" />
            <el-option label="冠心病" value="冠心病" />
            <el-option label="高血脂" value="高血脂" />
            <el-option label="其他" value="其他" />
          </el-select>
        </el-form-item>
        <el-form-item label="年龄">
          <el-input v-model="editForm.age" />
        </el-form-item>
        <el-form-item label="治疗方式">
          <!-- <el-input v-model="editForm.therapeutic_modality" /> -->
          <el-select v-model="editForm.therapeutic_modality" placeholder="请选择治疗方式">
            <el-option label="手术" value="手术" />
            <el-option label="化疗" value="化疗" />
            <el-option label="放疗" value="放疗" />
            <el-option label="介入治疗" value="介入治疗" />
            <el-option label="分子靶向" value="分子靶向" />
            <el-option label="免疫治疗" value="免疫治疗" />
            <el-option label="中医中药" value="中医中药" />
          </el-select>
        </el-form-item>
        <el-form-item label="性别">
          <el-select v-model="editForm.gender" placeholder="请选择性别">
            <el-option label="男" value="男" />
            <el-option label="女" value="女" />
          </el-select>
        </el-form-item>

        <el-form-item label="生育史">
          <el-input v-model="editForm.fertility_history" />
        </el-form-item>
        <el-form-item label="入院日期">
          <el-date-picker
            v-model="editForm.inhospital_time"
            type="datetime"
            placeholder="请选择入院日期和时间"
            format="yyyy-MM-dd HH:mm:ss"
            value-format="yyyy-MM-dd HH:mm:ss"
            style="width: 100%;"
          />
        </el-form-item>
        <el-form-item label="入院时体温">
          <el-input v-model="editForm.temperature" />
        </el-form-item>
        <el-form-item label="入院时脉搏">
          <el-input v-model="editForm.pulse" />
        </el-form-item>
        <el-form-item label="入院时呼吸">
          <el-input v-model="editForm.respiration_rate" />
        </el-form-item>
        <el-form-item label="入院时血压">
          <el-input v-model="editForm.blood_pressure" />
        </el-form-item>
        <el-form-item label="出院日期">
          <el-date-picker
            v-model="editForm.outhospital_time"
            type="datetime"
            placeholder="请选择出院日期和时间"
            format="yyyy-MM-dd HH:mm:ss"
            value-format="yyyy-MM-dd HH:mm:ss"
            style="width: 100%;"
          />
        </el-form-item>
        <el-form-item label="出院时体温">
          <el-input v-model="editForm.temperature_out" />
        </el-form-item>
        <el-form-item label="出院时脉搏">
          <el-input v-model="editForm.pulse_out" />
        </el-form-item>
        <el-form-item label="出院时呼吸">
          <el-input v-model="editForm.respiration_rate_out" />
        </el-form-item>
        <el-form-item label="出院时血压">
          <el-input v-model="editForm.blood_pressure_out" />
        </el-form-item>
        <el-form-item label="2个月时体温">
          <el-input v-model="editForm.temperature_2_months" />
        </el-form-item>
        <el-form-item label="2个月时脉搏">
          <el-input v-model="editForm.pulse_2_months" />
        </el-form-item>
        <el-form-item label="2个月时呼吸">
          <el-input v-model="editForm.respiration_rate_2_months" />
        </el-form-item>
        <el-form-item label="2个月时血压">
          <el-input v-model="editForm.blood_pressure_2_months" />
        </el-form-item>
        <el-form-item label="婚姻状况">
          <!-- <el-input v-model="editForm.marital_status" /> -->
          <el-select v-model="editForm.marital_status" placeholder="请选择婚姻状况">
            <el-option label="未婚" value="未婚" />
            <el-option label="已婚" value="已婚" />
            <el-option label="丧偶" value="丧偶" />
            <el-option label="离婚" value="离婚" />
            <el-option label="未说明的婚姻状况" value="未说明的婚姻状况" />
          </el-select>
        </el-form-item>
        <el-form-item label="受教育程度">
          <!-- <el-input v-model="editForm.education_level" /> -->
          <el-select v-model="editForm.education_level" placeholder="请选择受教育程度">
            <el-option label="文盲及半文盲" value="文盲及半文盲" />
            <el-option label="小学" value="小学" />
            <el-option label="初中" value="初中" />
            <el-option label="高中/技校/中专" value="高中/技校/中专" />
            <el-option label="大专" value="大专" />
            <el-option label="本科" value="本科" />
            <el-option label="硕士及以上" value="硕士及以上" />
          </el-select>
        </el-form-item>
        <el-form-item label="职业">
          <!-- <el-input v-model="editForm.occupation" />
          ①②③④⑤⑥⑦⑧⑨⑩⑪ -->
          <el-select v-model="editForm.occupation" placeholder="请选择职业">
            <el-option label="公务员" value="公务员" />
            <el-option label="企事业单位人员" value="企事业单位人员" />
            <el-option label="教师" value="教师" />
            <el-option label="医务人员" value="医务人员" />
            <el-option label="科研人员" value="科研人员" />
            <el-option label="其他专业技术人员" value="其他专业技术人员" />
            <el-option label="商业、服务业人员" value="商业、服务业人员" />
            <el-option label="农民" value="农民" />
            <el-option label="工人" value="工人" />
            <el-option label="军人" value="军人" />
            <el-option label="其他" value="其他" />
          </el-select>
        </el-form-item>
        <el-form-item label="医疗费用承担方式">
          <!-- ①②
③④⑤⑥⑦⑧
          <el-input v-model="editForm.methods_of_medical_cost_coverage" /> -->
          <el-select v-model="editForm.methods_of_medical_cost_coverage" placeholder="请选择医疗费用承担方式">
            <el-option label="城镇职工基本医疗保险" value="城镇职工基本医疗保险" />
            <el-option label="城镇居民基本医疗保险" value="城镇居民基本医疗保险" />
            <el-option label="受新型农村合作医疗" value="受新型农村合作医疗" />
            <el-option label="贫困救助" value="贫困救助" />
            <el-option label="商业医疗保险" value="商业医疗保险" />
            <el-option label="全公费" value="全公费" />
            <el-option label="全自费" value="全自费" />
            <el-option label="其他" value="其他" />
          </el-select>
        </el-form-item>
        <el-form-item label="居住地">
          <el-input v-model="editForm.address" />
        </el-form-item>
        <el-form-item label="电话">
          <el-input v-model="editForm.phone" />
        </el-form-item>
        <el-form-item label="备注">
          <el-input v-model="editForm.notes" />
        </el-form-item>
        <el-form-item label="角色">
          <el-select v-model="editForm.roles" placeholder="请选择角色" style="width: 100%;">
            <el-option label="User" value="user" />
            <el-option label="Doctor" value="doctor" />
          </el-select>
        </el-form-item>
        <el-form-item label="group_class">
          <el-input v-model="editForm.group_class" :disabled="true" />
        </el-form-item>
      </el-form>
      <!-- 对话框底部的按钮 -->
      <div slot="footer" class="dialog-footer">
        <el-button @click="editDialogVisible = false">取消</el-button>
        <el-button type="primary" @click="handleEdit">保存</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { patientList } from '@/api/nurse/patient_list' // 导入查询接口
import Pagination from '@/components/Pagination'
import { deletePatient } from '@/api/nurse/patient_list' // 导入删除接口
import { addPatient } from '@/api/nurse/patient_list' // 导入新增接口
import { updatePatient } from '@/api/nurse/patient_list' // 导入编辑接口
import * as XLSX from 'xlsx'

export default {
  name: 'PatientList',
  components: { Pagination },
  data() {
    return {
      userinfo: [],
      total: 0,
      listLoading: true,
      listQuery: {
        page: 1,
        limit: 10,
        admission_no: '', // 添加住院号搜索
        name: '', // 添加姓名搜索
        group_class: '0' // 添加 group_class 过滤，默认值为 0 护士组
      },
      addDialogVisible: false, // 控制新增对话框的显示
      addForm: { // 新增表单
        name: '',
        admission_no: '',
        identity_card: '',
        diagnosis: '',
        comorbidity: '',
        age: '',
        therapeutic_modality: '',
        gender: '',
        fertility_history: '',
        inhospital_time: '',
        temperature: '',
        pulse: '',
        respiration_rate: '',
        blood_pressure: '',
        outhospital_time: '',
        temperature_out: '',
        pulse_out: '',
        respiration_rate_out: '',
        blood_pressure_out: '',
        temperature_2_months: '',
        pulse_2_months: '',
        respiration_rate_2_months: '',
        blood_pressure_2_months: '',
        marital_status: '',
        education_level: '',
        occupation: '',
        methods_of_medical_cost_coverage: '',
        address: '',
        phone: '',
        notes: '',
        create_time: new Date().toLocaleDateString(),
        update_time: new Date().toLocaleDateString(),
        roles: '',
        group_class: '0'
      },
      addFormdefault: {
        // 新增页面字段初始化默认值为1
        group_class: '0'
        // 其他字段
      },
      idd: { 'id': 1 },
      editDialogVisible: false, // 控制编辑对话框的显示
      editForm: { // 编辑表单
        id: '',
        name: '',
        admission_no: '',
        identity_card: '',
        diagnosis: '',
        comorbidity: '',
        age: '',
        therapeutic_modality: '',
        gender: '',
        fertility_history: '',
        inhospital_time: new Date().toLocaleDateString(),
        temperature: '',
        pulse: '',
        respiration_rate: '',
        blood_pressure: '',
        outhospital_time: new Date().toLocaleDateString(),
        temperature_out: '',
        pulse_out: '',
        respiration_rate_out: '',
        blood_pressure_out: '',
        temperature_2_months: '',
        pulse_2_months: '',
        respiration_rate_2_months: '',
        blood_pressure_2_months: '',
        marital_status: '',
        education_level: '',
        occupation: '',
        methods_of_medical_cost_coverage: '',
        address: '',
        phone: '',
        notes: '',
        create_time: new Date().toLocaleDateString(),
        update_time: new Date().toLocaleDateString(),
        roles: '',
        group_class: '0'
      }
    }
  },
  created() {
    this.getList()
  },
  methods: {
    getList() {
      this.listLoading = true
      patientList(this.listQuery).then(response => {
        // 过滤数据，新增 group 条件
        const filteredData = response.data.userinfo.filter(item => {
          const admissionNoMatch = this.listQuery.admission_no === '' || item[2].includes(this.listQuery.admission_no)
          const nameMatch = this.listQuery.name === '' || item[1].includes(this.listQuery.name)
          const groupMatch = item[35] === this.listQuery.group_class // 过滤 group 等于 1 的数据
          return admissionNoMatch && nameMatch && groupMatch
        })

        // 确定当前页面的数据起始和结束索引
        const start = (this.listQuery.page - 1) * this.listQuery.limit
        const end = start + this.listQuery.limit

        // 使用 slice 截取当前页的数据
        const paginatedData = filteredData.slice(start, end)

        // 查看数据
        // 遍历 `paginatedData` 数组，构建每一行的数据
        this.userinfo = paginatedData.map(item => ({
          id: item[0],
          name: item[1],
          admission_no: item[2],
          identity_card: item[3],
          diagnosis: item[4],
          comorbidity: item[5],
          age: item[6],
          therapeutic_modality: item[7],
          gender: item[8],
          fertility_history: item[9],
          inhospital_time: item[10],
          temperature: item[11],
          pulse: item[12],
          respiration_rate: item[13],
          blood_pressure: item[14],
          outhospital_time: item[15],
          temperature_out: item[16],
          pulse_out: item[17],
          respiration_rate_out: item[18],
          blood_pressure_out: item[19],
          temperature_2_months: item[20],
          pulse_2_months: item[21],
          respiration_rate_2_months: item[22],
          blood_pressure_2_months: item[23],
          marital_status: item[24],
          education_level: item[25],
          occupation: item[26],
          methods_of_medical_cost_coverage: item[27],
          address: item[28],
          phone: item[29],
          notes: item[30],
          create_time: item[31],
          update_time: item[32],
          roles: item[34],
          group_class: item[35]
        }))

        // 设置 total 的值为过滤后的数据总数
        this.total = filteredData.length
        this.listLoading = false
      }).catch(error => {
        console.error('Failed to fetch data:', error)
        this.listLoading = false
      })
    },
    // 删除逻辑
    handleDelete(id) {
      console.log(id)
      this.$confirm('确定删除此条记录吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.listLoading = true
        const iddd = { 'id': id }
        console.log(iddd)
        deletePatient(iddd)
          .then(response => {
            this.$message.success('删除成功!')
            this.getList() // 删除成功后刷新列表
          })
          .catch(error => {
            console.error('Failed to delete data:', error)
            this.$message.error('删除失败!')
          })
          .finally(() => {
            this.listLoading = false
          })
      }).catch(() => {
        this.$message.info('取消删除')
      })
    },
    handleFilter() {
      this.listQuery.page = 1
      this.getList()
    },
    // 打开新增对话框
    openAddDialog() {
      console.log('新增按钮被点击了') // 检查点击事件
      this.addDialogVisible = true
    },
    // 保存新增数据
    handleAdd() {
      if (this.addForm.name == '') {
        this.$message.error('请填写姓名及住院号!')
      } else if (this.addForm.admission_no == '') {
        this.$message.error('请填写姓名及住院号!')
      } else {
      // 检查表单是否有效，并将时间字段转换为 'YYYY-MM-DD HH:mm:ss' 格式
        const formatDate = (date) => {
          const d = new Date(date)
          const year = d.getFullYear()
          const month = (d.getMonth() + 1).toString().padStart(2, '0')
          const day = d.getDate().toString().padStart(2, '0')
          const hours = d.getHours().toString().padStart(2, '0')
          const minutes = d.getMinutes().toString().padStart(2, '0')
          const seconds = d.getSeconds().toString().padStart(2, '0')
          return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
        }

        // 处理入院和出院日期字段，并将格式化后的日期赋值回 addForm
        this.addForm.inhospital_time = formatDate(this.addForm.inhospital_time)
        this.addForm.outhospital_time = formatDate(this.addForm.outhospital_time)

        // 打印新增的数据
        console.log('新增数据', this.addForm)

        // 发送新增请求
        addPatient(this.addForm).then(() => {
          this.$message.success('新增成功!')
          this.addDialogVisible = false // 关闭对话框
          this.getList() // 刷新列表
        }).catch(() => {
          this.$message.error('新增失败!')
        })
      }
    },
    // 打开编辑对话框
    openEditDialog(row) {
      // 将选中行的数据填充到 editForm 中
      this.editForm = { ...row }
      this.editDialogVisible = true
    },
    // 更新患者信息
    handleEdit() {
      console.log(this.editForm.name)
      console.log(this.editForm.admission_no)
      if (this.editForm.name == '') {
        this.$message.error('请填写姓名及住院号!')
      } else if (this.editForm.admission_no == '') {
        this.$message.error('请填写姓名及住院号!')
      } else {
      // 将表单中的时间字段转换为 'YYYY-MM-DD HH:mm:ss' 格式
        const formatDate = (date) => {
          const d = new Date(date)
          const year = d.getFullYear()
          const month = (d.getMonth() + 1).toString().padStart(2, '0')
          const day = d.getDate().toString().padStart(2, '0')
          const hours = d.getHours().toString().padStart(2, '0')
          const minutes = d.getMinutes().toString().padStart(2, '0')
          const seconds = d.getSeconds().toString().padStart(2, '0')
          return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
        }

        // 处理入院和出院日期字段，并将格式化后的日期赋值回 editForm
        this.editForm.inhospital_time = formatDate(this.editForm.inhospital_time)
        this.editForm.outhospital_time = formatDate(this.editForm.outhospital_time)

        // 打印更新的数据
        console.log('更新数据', this.editForm)

        // 发送更新请求
        updatePatient(this.editForm).then(() => {
          this.$message.success('更新成功!')
          this.editDialogVisible = false // 关闭对话框
          this.getList() // 刷新列表
        }).catch(() => {
          this.$message.error('更新失败!')
        })
      }
    },
    formatDate(dateString) {
      if (!dateString) return ''
      const date = new Date(dateString)
      const year = date.getFullYear()
      const month = (date.getMonth() + 1).toString().padStart(2, '0')
      const day = date.getDate().toString().padStart(2, '0')
      return `${year}/${month}/${day}`
    },
    handleClick(id,name) {
      this.$router.push({
        path: '/zhjkaixinli/hzxilbdb',
        query: { id: id ,name: name}
      })
    },
    handleClickmonthtraininglist(id) {
      this.$router.push({
        path: '/zhjkaixinli/tongjimonth',
        query: { id: id }
      })
    },
    handleClicktraininglist(id) {
      this.$router.push({
        path: '/zhjkaixinli/traininglist',
        query: { id: id }
      })
    },
    // 导出 Excel
    exportExcel() {
      // 临时保存当前的分页限制和页码
      const oldLimit = this.listQuery.limit
      const oldPage = this.listQuery.page

      // 设置 limit 为一个足够大的值，确保获取到所有数据
      this.listQuery.limit = Infinity
      this.listQuery.page = 1

      // 获取所有数据
      patientList(this.listQuery).then(response => {
        // 重置分页限制和页码
        this.listQuery.limit = oldLimit
        this.listQuery.page = oldPage

        // 过滤数据
        const filteredData = response.data.userinfo.filter(item => {
          const admissionNoMatch = this.listQuery.admission_no === '' || item[2].includes(this.listQuery.admission_no)
          const nameMatch = this.listQuery.name === '' || item[1].includes(this.listQuery.name)
          const groupMatch = item[35] === this.listQuery.group_class // 过滤 group 等于 1 的数据
          return admissionNoMatch && nameMatch && groupMatch
        })

        // 将所有数据格式化为 Excel 数据
        const exportData = filteredData.map(item => ({
          'ID': item[0],
          '姓名': item[1],
          '住院号': item[2],
          '身份证号码及账号': item[3],
          '诊断': item[4],
          '合并疾病': item[5],
          '年龄': item[6],
          '治疗方式': item[7],
          '性别': item[8],
          '生育史': item[9],
          '入院日期': this.formatDate(item[10]),
          '入院时体温': item[11],
          '入院时脉搏': item[12],
          '入院时呼吸': item[13],
          '入院时血压': item[14],
          '出院日期': this.formatDate(item[15]),
          '出院时体温': item[16],
          '出院时脉搏': item[17],
          '出院时呼吸': item[18],
          '出院时血压': item[19],
          '2个月时体温': item[20],
          '2个月时脉搏': item[21],
          '2个月时呼吸': item[22],
          '2个月时血压': item[23],
          '婚姻状况': item[24],
          '教育程度': item[25],
          '职业': item[26],
          '医疗费用承担方式': item[27],
          '居住地': item[28],
          '电话': item[29],
          '备注': item[30],
          '创建时间': this.formatDate(item[31]),
          '更新时间': this.formatDate(item[32]),
          '角色': item[34],
          '组': item[35]
        }))

        // 创建工作簿和工作表
        const worksheet = XLSX.utils.json_to_sheet(exportData)
        const workbook = XLSX.utils.book_new()
        XLSX.utils.book_append_sheet(workbook, worksheet, '患者信息-护士组')

        // 导出 Excel 文件
        XLSX.writeFile(workbook, '患者信息-护士组.xlsx')
      }).catch(error => {
        console.error('Failed to fetch data:', error)
      })
    }
  }
}
</script>
